<template>
    <div class="layout-nav" v-if="breadData&&breadData.length">
        <div class="breadcrumb">
            <template v-for="item in breadData">
                <span class="breadcrumb-item">
                    <router-link v-if="item.path" :to="item.path" replace>{{ item.name }}</router-link>
                    <span v-else>{{ item.name }}</span>
                    <span class="breadcrumb-separator">/</span>
                </span>
            </template>
        </div>
    </div>
</template>

<script>
    import '@/assets/less/modules/breadCrumb.less'
    export default {
        name: 'breadCrumb',
        data() {
            return {
            }
        },
        computed: {
            breadData() {
                return this.$store.getters.breadData
            }
        }
    }
</script>